<template>
  <el-table :data="tableData" style="width: 100%; height: 100%" stripe>
    <el-table-column prop="name" label="姓名" />
    <el-table-column prop="office" label="科室" />
    <el-table-column prop="hospital" label="所属医院" />
    <el-table-column prop="intro" min-width="380" label="简介" />
    <el-table-column label="操作" min-width="80">
      <template #default="scope">
        <div class="btn">
          <el-button
            link
            type="primary"
            style="font-size: 16px"
            size="small"
            @click="cancel(scope.row)"
            class="cancel"
            >取消</el-button
          >

          <el-button
            link
            type="primary"
            style="font-size: 16px"
            size="small"
            class="invite"
            @click="invite(scope.row)"
            >邀请</el-button
          >
        </div>
      </template>
    </el-table-column>
  </el-table>
</template>

<script setup>
const tableData = [
  {
    id: "1",
    name: "毛宣飞",
    office: "神经内科",
    hospital: "龙华医院",
    intro: "毛宣飞医生从事神经内科的临床工作已有十多年，专注于脑卒中、癫痫、帕金森病等常见神经系统疾病的诊治，积累了丰富的临床经验。尤其擅长脑血管病的早期诊断与干预，致力于通过早期干预减少患者的后遗症。曾多次在国内外学术会议上发表研究成果。",
  },
  {
    id: "2",
    name: "李文杰",
    office: "心血管内科",
    hospital: "市医院",
    intro: "李文杰医生拥有心血管内科的硕士学位，专注于冠心病、高血压及心律失常的治疗与管理。他在心脏介入治疗和心脏超声检查方面有着深入的研究。李医生致力于通过个性化治疗方案，帮助患者改善心血管健康，尤其对老年患者的管理有独特的经验和见解。",
  },
  {
    id: "3",
    name: "张志强",
    office: "外科",
    hospital: "人民医院",
    intro: "张志强医生是一名资深外科专家，擅长各种常见和复杂的外科手术，尤其在肝胆外科、消化道肿瘤及腹腔镜手术方面有着丰富的经验。张医生注重术前、术中和术后的全程管理，致力于为患者提供更加安全、有效的治疗方案，并积极参与相关的临床研究和学术活动。",
  },
  {
    id: "4",
    name: "王玲",
    office: "内分泌科",
    hospital: "中医院",
    intro: "王玲医生在内分泌科有超过十年的从业经验，擅长糖尿病、甲状腺疾病、肥胖症等内分泌相关疾病的诊断与治疗。她结合中西医的治疗方法，帮助患者更好地控制病情，特别是在糖尿病患者的生活方式干预和综合治疗方面有着深厚的积累。王医生的治疗理念是‘整体观念’，注重治疗的个性化。",
  },
  {
    id: "5",
    name: "赵翔",
    office: "肾脏科",
    hospital: "联合医院",
    intro: "赵翔医生主要从事慢性肾病、急性肾衰竭、肾透析及肾移植的临床工作。赵医生在肾脏疾病的早期筛查、精准治疗和肾脏移植后的免疫抑制治疗方面有较高的造诣。长期以来，赵医生注重与患者的沟通，强调生活质量的提升，并致力于肾脏病防治的科普工作。",
  },
  {
    id: "6",
    name: "钱琳",
    office: "眼科",
    hospital: "光明医院",
    intro: "钱琳医生是一位资深的眼科专家，擅长白内障、青光眼、眼底病及视网膜疾病的诊断与治疗。钱医生长期从事眼科手术，尤其擅长眼科微创手术，致力于恢复患者视力，改善生活质量。她还参与了多项眼科疾病的临床研究，并为患者提供个性化的治疗方案。",
  },
  {
    id: "7",
    name: "孙建国",
    office: "耳鼻喉科",
    hospital: "市人民医院",
    intro: "孙建国医生从事耳鼻喉科工作多年，擅长治疗各种耳鼻喉疾病，尤其在耳聋、鼻窦炎、咽喉疾病的诊治方面有着丰富经验。孙医生采用微创技术治疗各类耳鼻喉科疾病，减轻患者痛苦，并致力于为患者提供一站式的耳鼻喉健康管理服务。",
  },
  {
    id: "8",
    name: "周芳",
    office: "皮肤科",
    hospital: "皮肤病医院",
    intro: "周芳医生是皮肤科的专家，专长于治疗各种皮肤病，如银屑病、湿疹、皮肤过敏等。周医生采用现代医学与传统中医相结合的治疗方法，帮助患者恢复健康皮肤。她长期致力于皮肤病的防治及皮肤护理，为众多患者提供了有效的解决方案。",
  },
  {
    id: "9",
    name: "吴俊",
    office: "妇产科",
    hospital: "妇产医院",
    intro: "吴俊医生拥有多年的妇产科临床经验，特别擅长高危妊娠、产前诊断及产后康复。吴医生精通各种产科手术，致力于提高母婴健康水平，并为不孕不育患者提供精准的诊疗方案。她的治疗理念是注重患者的整体健康与长期福祉。",
  },
  {
    id: "10",
    name: "郑雪",
    office: "儿科",
    hospital: "儿童医院",
    intro: "郑雪医生是一名专注于儿童健康的专家，擅长儿童常见病、多发病的诊治，尤其在儿童呼吸系统疾病和免疫系统疾病的管理方面有丰富经验。郑医生热心于儿童的健康成长，倡导早期干预，帮助家长为孩子提供更好的成长环境。",
  },

]

// 将数据传给父组件
const emit = defineEmits();
const exportData = ref([]);
// 邀请
const invite = (row) => {
  console.log(row);
  exportData.value.push(row);
  emit("updateMessage", exportData.value);
};
// 取消
const cancel = (row) => {
  const index = exportData.value.findIndex((item) => item.id === row.id);
  if (index !== -1) {
    exportData.value.splice(index, 1);
  }
};
</script>

<style lang="scss" scoped>
.btn {
  display: flex;
  .cancel {
    color: #eb4f53;
  }
}
</style>
